<template>
	<view>
		<view class="BIG-cell-box">
			<!-- <view class="BIG-PL-head">
				<text>商品评论</text>
			</view> -->
			<view class="BIG-cell-PL-content" v-for="(item,index) in PJlist" :key="index" @click="toDetail(item.id)">
				<view class="BIG-cell-PL-top">
					<!-- <view class="imgBOX">
						<image :src="item.goods.image" mode=""></image>
					</view> -->
					<view class="BIG-cell-PL-main">
						<text class="title">{{item.title}}</text>
						<view class="time-Box">
							<text class="time">{{item.createtime}}</text>
							<!-- <uni-rate :readonly="true" :value="item.level" /> -->
						</view>
					</view>
					
					
				</view>
				<view class="BIG-cell-PL-text">
					{{item.content}}
					<!-- <view class="BIGPJ_imgBox" v-if="item.images.length!==0">
						<image  @click.stop="onGoodsSwiperPJ(item.images,inde)" v-for="(itq,inde) in item.images" :src="itq" mode="aspectFill"></image>
						<video v-if="item.video!==''" :src="$IMG_URL+item.video"></video>
					</view> -->
				</view>
			</view>
			
		</view>
			<text class="hr" v-if="pageData.page>lastPage">————&nbsp;&nbsp;&nbsp;&nbsp;没有更多了&nbsp;&nbsp;&nbsp;&nbsp;————</text>
	</view>
</template>

<script>
	import http from '@/shopro/request/index'
	export default {
		data() {
			return {
				PJlist:[],
				pageData:{
					per_page:10,
					page:1,
					// isUser:'1',
					// type:'all'
				},
				lastPage:null
			};
		},
		onLoad() {
			this.init()
		},
		onPullDownRefresh() {
			this.pageData.page = 1
			this.init()
			uni.stopPullDownRefresh()
		},
		onReachBottom() {
			if(this.pageData.page==1||this.pageData.page<=this.lastPage){
				this.init()
			} else if(this.pageData.page>this.lastPage) {
				console.log('加载完毕');
			} else {
				console.log('首次进入页面不予加载触底事件');
			}
			
		},
		methods:{
			toDetail(id){
				uni.navigateTo({
					url:'/pages/app/detailNandT?id='+id+'&type=news'
				})
			},
			// 评价图片预览
			onGoodsSwiperPJ(list,e) {
				console.log(e);
				this.$tools.previewImage(list, e);
			},
			init(){
				http('user.userNewsList',this.pageData).then(res=>{
					// console.log(res);
					if(res.data.current_page==1){
						this.PJlist = res.data.data
					} else {
						this.PJlist = [...this.PJlist,...res.data.data]
					}
					this.lastPage = res.data.last_page
					this.pageData.page +=1
					console.log(this.PJlist);
				})
			}
		}
	}
</script>

<style lang="scss">
	.BIGPJ_imgBox {
		margin-top: 15px;
		image {
			max-width: 30%;
			max-height: 100px;
			margin-right: 5%;
			&:nth-child(3n){
				margin-right: 0;
			}
		}
		video {
			z-index: 1;
			max-width: 30%;
			max-height: 100px;
		}
	}
	.hr {
		font-size: 13px;
		display: block;
		text-align: center;
		color: #999;
		margin: 14px 0;
		position: relative;
		// &::before {
		// 	content: '';
		// 	height: 1px;
		// 	width: 50%;
		// 	border-top: 0.5px solid red;
		// 	// background-color: red;
		// 	position: absolute;
		// 	top: 50%;
		// 	left: 25%;
		// }
	}
.BIG-cell-box {
	width: 94%;
			background-color: #ffffff;
			border-radius: 10px;
			padding: 19px 12px 12px;
			box-sizing: border-box;
			margin: 0 auto;
			margin-top: 12px;
			.BIG-goods-detail {
				font-size: 22px;
				font-weight: bold;
				color: #000;
			}
			.BIG-goods-price {
				margin-top: 23px;
				font-size: 20px;
				font-weight: bold;
				color: #ff0000;
				text {
					font-size: 28px;
				}
			}
			.BIG-num {
				font-size: 20px;
				color: #ff0000;
			}
			.BIG-PL-head {
				display: flex;
				justify-content: space-between;
				text {
					font-size: 20px;
					font-weight: bold;
					color: #000;
				}
				.BIG-PL-more {
					font-size: 17px;
					font-weight: normal;
					color: #999;
					display: flex;
					align-items: center;
					.icon-BIG {
						margin-left: 8px;
					}
				}
			}
			.BIG-cell-PL-content {
				margin-top: 9px;
				padding-bottom: 5px;
				border-bottom: 1px solid #e5e5e5;
				.BIG-cell-PL-top {
					display: flex;
					align-items: center;
					.imgBOX {
						max-width: 75px;
						max-height: 75px;
						border-radius: 8px;
						margin-right: 15px;
						image {
							max-width: 100%;
							max-height: 75px;
							border-radius:8px;
						}
					}
					.BIG-cell-PL-main {
						flex: 1;
						.title {
							display: block;
							font-size: 18px;
							color: #000;
							overflow : hidden;
							text-overflow: ellipsis;
							display: -webkit-box;
							-webkit-line-clamp: 2;
							-webkit-box-orient: vertical;
						}
						.time {
							font-size: 14px;
							color: #999;
						}
					}
				}
				.BIG-cell-PL-text {
					font-size: 18px;
					color: #000;
					margin-top: 13px;
					overflow : hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
				}
				
			}
		}
		
</style>
